Ext.define('GM.FeedPanel', {
extend: 'Ext.panel.Panel',
    alias: 'widget.feedPanel',
    title: 'Feeds',

    initComponent: function(){
        Ext.apply(this, {
            items: this.createView(),
            dockedItems: this.createToolbar()
        });
    },

    createView: function(){
        this.view = Ext.create('widget.dataview', {
            store: Ext.create('Ext.data.Store', {
                model: 'Feed',
                data: this.feeds
            }),
            selModel: {
                model: 'SINGLE',
                listeners: {
                    scope: this,
                    selectionchange: this.onSelectionChange
                }
            },
            listeners: {
                scope: this,
                contextmenu: this.onContextMenu
            },
            trackOver: true,
            cls: 'feed-list',
            itemSelector: '.feed-list-item',
            overItemCls: 'feed-list-item-hover',
            tpl: '<tpl for="."><div class="feed-list-item">{title}</div></tpl>'
        });
        return this.view;
    },

    createToolbar: function(){
        this.createActions();
        /* this.toolbar = Ext.create('widget.toolbar', {
            items: [this.addAction, this.removeAction]
        }); */
        return this.toolbar;
    },

    createActions: function(){
        this.addAction = Ext.create('Ext.Action', {
            scope: this,
            //handler: this.onAddFeedClick,
            text: 'Add feed',
            iconCls: 'feed-add'
        });

        this.removeAction = Ext.create('Ext.Action', {
            itemId: 'remove',
            scope: this,
            //handler: this.onRemoveFeedClick,
            text: 'Remove feed',
            iconCls: 'feed-remove'
        });
    }
});
